<template lang="pug">
  div.table-empty
    s-table(
      ref="table"
      v-loading="loading"
      req-method="get"
      reqUrl="web/materials/category"
      :column="classesColumn"
      :filterProps="{fields: searchConfig, showBtns: false}"
      :queryPropsParams="{areaId: curArea.areaId}"
    )
      .table-operator(slot="table-operator")
        el-button.gradientVertical(size="large"  @click="actionHandle({}, 'add')" round) 新增
      template(slot="created" slot-scope="text, scope")
        span {{text | dateFilter('YYYY/MM/DD hh:mm:ss')}}
</template>
<script>
import { mapGetters } from 'vuex'
import { column } from './config'
import { addCategory } from './api'
export default {
  components: {
  },
  data () {
    return {
      classesColumn: column,

      classes: [],
      classId: '',

      loading: false
    }
  },
  computed: {
    ...mapGetters(['curArea']),
    searchConfig () {
      return []
    }
  },
  created () {
  },
  methods: {
    refreshTable (flag = false) {
      this.$refs.table.refresh(flag)
    },
    actionHandle (row, type = 'unbind') {
      console.log(type)
      if (type === 'add') {
        this.addCategory()
      }
    },

    addCategory (inputValue, row) {
      this.$prompt('请输入分类名称', '资产分类', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        inputValue: inputValue
      }).then(({ value }) => {
        if (value) {
          addCategory({ name: value, sort: 0 }).then(res => {
            console.log(res)
            this.$message.success('提交成功')
            this.refreshTable()
          })
        }
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.video{
  width: 100%;
  height: 560px
}
.close{
  margin-top: 20px;
}
</style>
